<template>
  <!-- hidden PageHeaderWrapper title demo -->
  <page-header-wrapper :title="false">
    <a-card :body-style="{padding: '24px 32px'}" :bordered="false">
      <a-form-item has-feedback>
        <a-select
          v-decorator="[
            'select',
            { rules: [{ required: true, message: '请选择学校权限' }] },
          ]"
          placeholder="请选择学校权限"
        >
          <a-select-option v-for="(item, index) in universityList" :value="item.key" :key="index">
            {{ item.point }}
          </a-select-option>
        </a-select>
        <a-button type="primary" @click="handleSelect('university')">分配学校权限</a-button>
        <a-select
          v-decorator="[
            'select',
            { rules: [{ required: true, message: '请选择学科权限' }] },
          ]"
          placeholder="请选择学科"
        >
          <a-select-option v-for="(item, index) in subjectList" :value="item.key" :key="index">
            {{ item.point }}
          </a-select-option>
        </a-select>
        <a-button type="primary" @click="handleSelect('subject')">分配学科权限</a-button>
      </a-form-item>
      <a-table
        :columns="columns"
        :data-source="tableData"
        :loading="loading"
        :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange, type: 'radio' }"
        bordered>
        <span slot="sort" slot-scope="text, record, index">{{ index + 1 }}</span>
        <div slot="action" slot-scope="text, record">
          <!-- <a @click="handleEdit(record.id)">编辑</a>
          <a-divider type="vertical" /> -->
          <a @click="handleDelete(record.user_id)" style="color:#ff4d4f">删除</a>
        </div>
      </a-table>
    </a-card>
  </page-header-wrapper>
</template>

<script>
import { getUserList, deleteUser } from '@/api/login'
import { getTableAuthority } from '@/api/table'
export default {
  name: 'BaseForm',
  data () {
    return {
      loading: true,
      // state: ['管理员', '大学填报', '学科填报'],
      columns: [{
        title: '编号',
        key: 'sort',
        dataIndex: 'sort',
        scopedSlots: { customRender: 'sort' }
      },
      {
        title: '归属部门',
        key: 'department',
        dataIndex: 'department',
        scopedSlots: { customRender: 'department' }
      },
      {
        title: '用户名',
        key: 'name',
        dataIndex: 'name',
        scopedSlots: { customRender: 'userName' }
      },
      {
        title: '用户类型',
        key: 'role_type',
        dataIndex: 'role_type'
      },
      // {
      //   title: '权限',
      //   key: 'authority',
      //   dataIndex: 'authority'
      // },
      {
        title: '操作',
        key: 'action',
        dataIndex: 'action',
        scopedSlots: { customRender: 'action' }
      }],
      tableData: [],
      selectedRowKeys: [],
      universityList: [],
      subjectList: [],
      universitySelect: '',
      subjectSelect: ''
    }
  },
  mounted () {
    this.getData()
    this.getAuthorityData()
  },
  methods: {
    getData () {
      return new Promise((resolve, reject) => {
        getUserList().then(response => {
          this.tableData = response.data
          this.loading = false
          resolve()
        }).catch(error => {
          reject(error)
        })
      })
    },
    getAuthorityData () {
      return new Promise((resolve, reject) => {
        getTableAuthority().then(response => {
          console.log(response)
          this.universityList = response.result.university
          this.subjectList = response.result.subject
          this.subject = response.result.subject
          resolve()
        }).catch(error => {
          reject(error)
        })
      })
    },
    onSelectChange (selectedRowKeys) {
      console.log(selectedRowKeys)
      // if (selectedRowKeys.length > 1) {
      //   selectedRowKeys.shift()
      // }
      // this.selectedRowKeys = selectedRowKeys
    },
    handleDelete (id) {
      const _this = this
      this.$confirm({
        title: '提示',
        content: '确定要删除该成员吗？',
        cancelText: '取消',
        okText: '确定',
        onOk () {
          return new Promise((resolve, reject) => {
            deleteUser(id).then(response => {
              _this.$message.success('删除成功')
              _this.getData()
              resolve()
            }).catch(error => {
              reject(error)
            })
          })
        },
        onCancel () {}
      })
    },
    handleSelect (type) {
      console.log(this.universitySelect)
    }
  }
}
</script>
<style lang="less" scoped>
  .tips {
    margin-bottom: 20px;
  }
  .ant-select {
    width: 200px;
    margin-right: 20px;
  }
  .ant-btn-primary {
    margin-right: 40px;
  }
</style>
